{{ template "header_" . }}

<h1>Session: <tt>{{ .ID }}</tt></h1>
<button onclick="window.location.href='/internal/dashboard/sessions/{{ .ID }}/stop'" {{ if not .IsActive }}disabled{{ end }}>Stop</button>
<button onclick="window.location.href='/internal/dashboard/sessions/{{ .ID }}/stop?force=true'" {{ if not .IsActive }}disabled{{ end }}>Force Stop</button>
<pre>{{ .SessionJSON }}</pre>

<h2>Inputs</h2>
<div class="jsoneditor">{{ .InputsJSON }}</div>

<style>
    .prints {
        background-color: lightgray;
        width: 100%;
        margin: 0 auto;
        min-height: 50px;
        font-family: monospace;
        white-space: pre-wrap;
    }
</style>

<h2>Prints</h2>
<pre class="prints">{{ .Prints}}</pre>

<h2>Log</h2>

<div class="tab">
    <button class="tablinks" onclick="viewTab('text-log')">Text</button>
    <button class="tablinks" onclick="viewTab('json-log')">JSON</button>
</div>

<div id="text-log" class="tabcontent">
<pre class="prints">{{ range .LogText }}{{ . }}
{{ end }}</pre>
</div>

<div id="json-log" class="tabcontent">
<div class="jsoneditor">{{ .LogJSON }}</div>
</div>

<script>
    setTimeout(function() { viewTab('text-log') }, 100)
</script>

{{ template "footer_" . }}
